body, html {
  padding: 0px;
  margin: 0px;
  color: #fff;
  font-family: 'Nunito', sans-serif;
  font-weight: 300;
  background-color: #000;
  font-size: 15px; }

input {
  font-size: 1em;
  font-family: 'Nunito', sans-serif; }

h1, h2, h3, h4, strong {
  font-weight: 700; }

.follow-us {
  position: absolute;
  display: block;
  top: 12.5px;
  right: 12.5px; }

h1, h5 {
  margin: 0px;
  padding: 0px; }

h3 {
  font-size: 1.3rem;
  line-height: 1.2em; }

a {
  cursor: pointer; }

.color-alert {
  color: #ff4d81 !important;
  display: inline-block; }

.color-happy {
  color: #ccf800 !important;
  display: inline-block; }

.color-finished {
  color: #ff50f9 !important;
  display: inline-block; }

.color-sad {
  color: #fff !important;
  display: inline-block; }

.color-10k {
  color: #ca57ff !important;
  display: inline-block; }

.color-highlight {
  color: #01f8fb !important;
  display: inline-block; }

.color-hospital {
  color: #ff4b4b !important;
  display: inline-block; }

.background-finished {
  background-color: #ff50f9 !important; }

.background-alert {
  background-color: #ff4d81 !important; }

.background-happy {
  background-color: #ccf800 !important; }

.background-sad {
  background-color: #fff !important; }

.background-10k {
  background-color: #ca57ff !important; }

.background-highlight {
  background-color: #01f8fb !important; }

.background-hospital {
  background-color: #ff4b4b !important; }

h1 {
  font-size: 1.5em;
  line-height: 1em; }
  h1 .light {
    color: #01f8fb; }
  h1 .dark {
    color: rgba(255, 255, 255, 0.2); }

h5 {
  font-size: .85em;
  font-weight: 300;
  line-height: 1.3em;
  padding-bottom: 20px; }
  h5.sml {
    font-size: .75em;
    padding-bottom: 5px; }
  h5:last-child {
    padding-bottom: 0px; }

* {
  box-sizing: border-box;
  -webkit-overflow-scrolling: touch; }

#map {
  height: 37vh;
  position: relative; }

#legend {
  height: 63vh;
  position: relative; }

#legend {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 2;
  background-color: #2a2a2a; }
  @media all and (min-width: 800px) {
    #legend {
      overflow-y: scroll; } }
  #legend .title {
    cursor: pointer;
    font-weight: 700;
    padding: 10px;
    padding-left: 15px;
    position: relative;
    line-height: 1em; }
    #legend .title .i {
      position: absolute;
      width: 15px;
      height: 15px;
      top: 50%;
      left: 5px;
      transform: rotate(0deg) translate(-50%, -50%);
      transform-origin: 50% 50%; }
      #legend .title .i i {
        color: #01f8fb;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: rotate(0deg) translate(-50%, -50%);
        font-size: .6em;
        line-height: 1em; }
  #legend .location {
    padding: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    transition: background .25s;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
    @media all and (min-width: 800px) {
      #legend .location:hover {
        background-color: rgba(1, 248, 251, 0.05); } }
    #legend .location.active {
      background-color: rgba(0, 0, 0, 0.3); }
    #legend .location:first-child {
      border-top: 1px solid rgba(0, 0, 0, 0.2); }
    #legend .location .patients {
      display: none;
      margin-top: 5px;
      overflow: hidden; }
    #legend .location .patient {
      font-size: .9em;
      line-height: 1.2em;
      padding-top: 2.5px;
      padding-bottom: 2.5px;
      border-top: 1px solid rgba(0, 0, 0, 0.2);
      padding-left: 5px;
      padding-right: 5px;
      position: relative; }
      #legend .location .patient.extra {
        display: none; }
      #legend .location .patient.show-all {
        text-align: center;
        padding: 2.5px;
        border: none; }
        #legend .location .patient.show-all a {
          display: inline-block;
          font-size: .9em;
          line-height: 1em;
          padding: 5px; }
      #legend .location .patient.graph-cases {
        min-height: 140px;
        padding: 0px;
        margin-left: 5px;
        margin-right: 5px;
        background-color: rgba(0, 0, 0, 0.2);
        box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.05), inset 0px 0px 5px rgba(0, 0, 0, 0.3);
        border-radius: 5px 5px 0px 0px;
        max-width: 100%;
        overflow-y: auto;
        /* width */
        /* Track */
        /* Handle */
        /* Handle on hover */ }
        #legend .location .patient.graph-cases h5 {
          padding: 0px;
          margin: 0px;
          padding-bottom: 5px;
          font-size: .85rem; }
        #legend .location .patient.graph-cases .graph-cases-inner {
          min-width: 1600px;
          padding: 5px;
          padding-bottom: 0px; }
        #legend .location .patient.graph-cases::-webkit-scrollbar {
          width: 5px;
          height: 5px;
          border-radius: 0px 0px 5px 5px; }
        #legend .location .patient.graph-cases::-webkit-scrollbar-track {
          background: rgba(0, 0, 0, 0.75);
          border-radius: 0px 0px 5px 5px; }
        #legend .location .patient.graph-cases::-webkit-scrollbar-thumb {
          background: rgba(1, 248, 251, 0.7);
          border-radius: 0px 0px 5px 5px; }
        #legend .location .patient.graph-cases::-webkit-scrollbar-thumb:hover {
          background: rgba(1, 248, 251, 0.9); }
      #legend .location .patient.graph-cases-transmission {
        border: none;
        padding-bottom: 10px;
        padding-top: 10px; }
        #legend .location .patient.graph-cases-transmission h5 {
          padding: 0px;
          margin: 0px;
          padding-bottom: 5px;
          font-size: .85rem; }
      #legend .location .patient.overview {
        padding-left: 5px;
        padding-top: 5px;
        padding-bottom: 5px; }
      #legend .location .patient .confirmed, #legend .location .patient .probable {
        font-weight: 700;
        background-color: rgba(0, 0, 0, 0.2);
        font-size: .8em;
        line-height: 1em;
        padding: 5px;
        padding-left: 7.5px;
        padding-right: 7.5px;
        border-radius: 10px;
        display: inline-block;
        box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.05), inset 0px 0px 5px rgba(0, 0, 0, 0.3);
        margin-bottom: 3.3333333333px;
        margin-top: 3.3333333333px; }
      #legend .location .patient .case {
        position: absolute;
        top: 7.5px;
        right: 5px;
        font-size: .75em;
        line-height: 1em;
        background-color: rgba(0, 0, 0, 0);
        padding: 3.3333333333px;
        padding-left: 5px;
        padding-right: 5px;
        border-radius: 10px;
        text-align: center;
        min-width: 40px;
        font-weight: 700;
        color: rgba(255, 255, 255, 0.75); }
      #legend .location .patient .p-state {
        position: absolute;
        top: 7.5px;
        right: 45px;
        font-size: .75em;
        line-height: 1em;
        background-color: rgba(0, 0, 0, 0);
        padding: 3.3333333333px;
        padding-left: 5px;
        padding-right: 5px;
        border-radius: 10px;
        text-align: center;
        min-width: 40px;
        font-weight: 700;
        color: rgba(255, 255, 255, 0.75);
        margin: 0px; }
        #legend .location .patient .p-state.confirmed {
          color: #ff4d81; }

.patient_details_output .item {
  font-size: .9em;
  position: relative;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 10px;
  padding-bottom: 10px; }
  .patient_details_output .item:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.patient_details_output .travel {
  display: block;
  padding-top: 5px;
  font-size: .9em;
  opacity: .7; }
.patient_details_output .sublocation {
  display: block;
  padding-top: 5px;
  font-size: .9em;
  font-weight: 700; }
.patient_details_output .probable {
  color: #01f8fb; }
.patient_details_output .confirmed {
  color: #ff4d81; }
.patient_details_output .confirmed, .patient_details_output .probable {
  font-weight: 700;
  text-transform: uppercase;
  font-size: .75em;
  line-height: 1em;
  border-radius: 10px;
  display: inline-block;
  opacity: .5; }
.patient_details_output .case {
  position: absolute;
  top: 15px;
  right: 0px;
  font-size: .75em;
  line-height: 1em;
  background-color: rgba(0, 0, 0, 0);
  border-radius: 10px;
  text-align: right;
  min-width: 30px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.5); }
.patient_details_output .p-state {
  position: absolute;
  top: 15px;
  right: 40px;
  font-size: .75em;
  line-height: 1em;
  border-radius: 10px;
  text-align: right;
  min-width: 40px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.75);
  margin: 0px; }
  .patient_details_output .p-state.confirmed {
    color: #ff4d81; }

.count-location {
  position: absolute;
  top: 50%;
  right: 0px;
  line-height: 1em;
  transform: translate(0%, -50%);
  background-color: rgba(0, 0, 0, 0.2);
  padding: 5px;
  padding-left: 10px;
  padding-right: 10px;
  min-width: 50px;
  text-align: center;
  border-radius: 20px;
  font-size: .75em;
  color: rgba(255, 255, 255, 0.75);
  box-shadow: 0px 0px 10px rgba(255, 255, 255, 0.05), inset 0px 0px 5px rgba(0, 0, 0, 0.3); }
  .count-location .death, .count-location .in-hospital {
    border-radius: 15px;
    padding: 5px;
    text-align: center; }
  .count-location .pull-out {
    top: 50%;
    transform: translate(-100%, -50%);
    left: -5px;
    position: absolute; }
  .count-location .death {
    background-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1), inset 0px 0px 5px rgba(255, 255, 255, 0.1); }
  .count-location .in-hospital {
    background-color: rgba(0, 0, 0, 0.2); }

@media all and (min-width: 800px) {
  #map {
    position: absolute;
    top: 0px;
    left: 30%;
    width: 70%;
    height: 100%; }

  #legend {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 30%;
    height: 100%; } }
a, input[type="submit"] {
  cursor: pointer;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px solid rgba(1, 248, 251, 0);
  transition: .25s; }
  @media all and (min-width: 800px) {
    a:hover, input[type="submit"]:hover {
      border-bottom: 1px solid #01f8fb; } }
  a i, input[type="submit"] i {
    color: #01f8fb;
    transition: .25s; }
  a.block-link, input[type="submit"].block-link {
    border: none;
    padding: 5px;
    padding-left: 15px;
    padding-right: 15px;
    background-color: rgba(0, 0, 0, 0.5);
    color: #01f8fb;
    border-bottom: none;
    border-radius: 20px;
    display: inline-block;
    font-weight: 700; }
    @media all and (min-width: 800px) {
      a.block-link:hover, input[type="submit"].block-link:hover {
        border-bottom: none;
        color: #2a2a2a;
        background-color: #01f8fb; }
        a.block-link:hover i, input[type="submit"].block-link:hover i {
          color: #2a2a2a; } }
    a.block-link.sml, input[type="submit"].block-link.sml {
      font-size: .8rem;
      line-height: 1em;
      padding-left: 10px;
      padding-right: 10px; }
    a.block-link.lrg, input[type="submit"].block-link.lrg {
      font-size: 1.2rem;
      line-height: 1em;
      padding: 10px; }
    a.block-link.block, input[type="submit"].block-link.block {
      display: block;
      text-align: center; }

.alert {
  background-color: #ff4d81;
  color: #fff;
  padding: 12.5px;
  padding-left: 55px;
  font-weight: 700;
  font-size: .8em;
  line-height: 1.4em;
  position: relative;
  text-decoration: none;
  display: block; }
  .alert i {
    position: absolute;
    top: 50%;
    left: 30px;
    font-size: 1.5rem;
    transform: translate(-50%, -50%);
    line-height: 1em; }
  .alert a {
    color: #fff;
    border-bottom: 1px solid #fff; }
  .alert.message {
    background-color: #000;
    color: #01f8fb; }
    .alert.message a {
      color: #01f8fb;
      border-bottom: 1px solid #fff; }

.explain-numbers {
  position: absolute;
  bottom: 10px;
  right: 10px;
  font-size: .8em;
  line-height: 1em; }

.built-by {
  padding: 15px;
  padding-top: 20px;
  padding-bottom: 20px;
  color: rgba(255, 255, 255, 0.5);
  font-size: .8em; }
  @media all and (max-width: 800px) {
    .built-by {
      background-color: rgba(0, 0, 0, 0.75); } }
  .built-by a {
    color: rgba(255, 255, 255, 0.75);
    font-weight: 300;
    padding: 5px;
    display: inline-block;
    padding-left: 0px;
    padding-right: 0px; }

.overview {
  padding: 15px;
  padding-right: 0px;
  position: relative; }

.share-links {
  position: relative;
  font-weight: 300;
  font-size: .9em; }
  .share-links a {
    margin-right: 5px; }

@keyframes pulse {
  0% {
    box-shadow: 0px 0px 0px rgba(255, 77, 129, 0), inset 0px 0px 0px rgba(1, 248, 251, 0); }
  50% {
    box-shadow: 0px 0px 30px rgba(255, 77, 129, 0.75), inset 0px 0px 5px rgba(1, 248, 251, 0.2); }
  100% {
    box-shadow: 0px 0px 0px rgba(255, 77, 129, 0), inset 0px 0px 0px rgba(1, 248, 251, 0); } }
.map-legend {
  position: absolute;
  top: 12.5px;
  right: 12.5px;
  z-index: 3;
  cursor: pointer;
  vertical-align: middle; }
  .map-legend a {
    display: inline-block;
    font-size: 1.25rem;
    line-height: 1em;
    background-color: #2a2a2a;
    vertical-align: middle; }
    .map-legend a i {
      vertical-align: middle; }
    .map-legend a.reset {
      padding: 9px;
      padding-left: 12px;
      padding-right: 12px;
      margin-left: 5px;
      font-size: .75rem;
      line-height: 1em; }
    .map-legend a.stats-link {
      background-color: #ccf800;
      box-shadow: inset 0px 0px 10px #01f8fb;
      color: #2a2a2a; }
      @media all and (min-width: 800px) {
        .map-legend a.stats-link:hover {
          background-color: #01f8fb; } }
      .map-legend a.stats-link i {
        color: #2a2a2a; }
      .map-legend a.stats-link span {
        font-size: 1rem;
        line-height: 1rem;
        vertical-align: middle; }
    .map-legend a.toogle-btn {
      background-color: transparent;
      font-size: .75rem;
      line-height: 1em;
      vertical-align: middle;
      color: #fff;
      margin: 0px;
      margin-left: 3px;
      background-color: rgba(42, 42, 42, 0.75);
      padding: 0px;
      border-radius: 30px;
      overflow: hidden;
      line-height: 1em;
      border-bottom: none; }
      .map-legend a.toogle-btn:hover {
        border-bottom: none; }
      .map-legend a.toogle-btn i {
        font-size: 1.5rem;
        line-height: 1em;
        color: #ff4d81; }
      .map-legend a.toogle-btn span {
        display: inline-block;
        line-height: 1em;
        border-radius: 30px;
        padding: 9px;
        padding-left: 12px;
        padding-right: 12px;
        transition: .25s; }
        .map-legend a.toogle-btn span:hover {
          color: #ff4d81; }
      .map-legend a.toogle-btn.off .off {
        background-color: #ff4d81;
        color: #000; }
      .map-legend a.toogle-btn.off.active-cases .off {
        background-color: #01f8fb;
        color: #000; }
      .map-legend a.toogle-btn.on .on {
        background-color: #ff4d81;
        color: #000; }
  .map-legend span.unconfirmed-location {
    vertical-align: middle;
    display: none;
    padding: 5px;
    color: #fff;
    border-bottom: none;
    border-radius: 20px;
    display: inline-block;
    font-weight: 700;
    font-size: .75rem; }

.popup {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: none;
  background-color: rgba(0, 0, 0, 0.9);
  z-index: 5; }
  .popup .popup-bg {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
    z-index: 1; }
    @media all and (max-width: 800px) {
      .popup .popup-bg {
        display: none; } }
  .popup .close-stats, .popup .close-popup {
    z-index: 3;
    position: absolute;
    top: 20px;
    right: 20px;
    color: #fff;
    border: none;
    font-size: 2rem;
    cursor: pointer;
    line-height: 1em;
    width: 50px;
    height: 50px;
    background-color: #2a2a2a;
    border-radius: 100%; }
    @media all and (max-width: 800px) {
      .popup .close-stats, .popup .close-popup {
        top: 10px;
        right: 10px; } }
    .popup .close-stats i, .popup .close-popup i {
      color: #fff;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      line-height: 1em;
      transition: .25s; }
    @media all and (min-width: 800px) {
      .popup .close-stats:hover i, .popup .close-popup:hover i {
        color: #01f8fb;
        transform: translate(-50%, -50%) rotate(90deg); } }
  .popup .inner {
    z-index: 2;
    /* width */
    /* Track */
    /* Handle */
    /* Handle on hover */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 340px;
    padding: 20px;
    background-color: #2a2a2a;
    color: #fff;
    border-radius: 10px;
    box-shadow: 0px 10px 30px black, inset 0px 10px 30px rgba(255, 255, 255, 0.1); }
    .popup .inner .bar-legend {
      margin-top: -5px;
      padding-bottom: 10px;
      font-size: .8em; }
      .popup .inner .bar-legend span {
        font-weight: 700; }
    .popup .inner .divider {
      height: 30px;
      position: relative;
      clear: both; }
    .popup .inner::-webkit-scrollbar {
      width: 10px;
      height: 10px; }
      @media all and (max-width: 800px) {
        .popup .inner::-webkit-scrollbar {
          width: 5px;
          height: 5px; } }
    .popup .inner::-webkit-scrollbar-track {
      background: rgba(0, 0, 0, 0.75);
      border-radius: 0px 10px 10px 0px; }
    .popup .inner::-webkit-scrollbar-thumb {
      background: rgba(1, 248, 251, 0.7);
      border-radius: 0px 10px 10px 0px; }
    .popup .inner::-webkit-scrollbar-thumb:hover {
      background: rgba(1, 248, 251, 0.9); }
    .popup .inner.full-width {
      box-shadow: none; }
    @media all and (min-width: 800px) {
      .popup .inner {
        max-width: 500px;
        max-height: 80vh;
        overflow-y: auto; }
        .popup .inner.full-width {
          width: 80%;
          max-width: 1300px;
          box-shadow: 0px 10px 30px black, inset 0px 10px 30px rgba(255, 255, 255, 0.1); } }
    @media all and (max-width: 800px) {
      .popup .inner {
        top: 0px;
        left: 0px;
        transform: none;
        max-width: 100%;
        width: 100%;
        height: 100%;
        overflow-y: auto;
        padding-top: 60px; }
        .popup .inner.small {
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          width: 100%;
          height: auto;
          max-width: 90vw;
          max-height: 70vh;
          padding: 20px; } }
    .popup .inner h3 {
      margin: 0px;
      padding: 0px;
      padding-bottom: 10px; }
    .popup .inner p {
      margin: 0px;
      padding: 0px;
      padding-bottom: 5px;
      font-size: .9rem;
      line-height: 1.3em; }
    .popup .inner .block-link {
      background-color: rgba(0, 0, 0, 0.2);
      color: #fff;
      margin-top: 10px; }
      .popup .inner .block-link:hover {
        background-color: #fff;
        color: #2a2a2a; }
    .popup .inner .stats {
      padding-bottom: 10px; }
      .popup .inner .stats:after {
        clear: both;
        content: '';
        display: block; }
      .popup .inner .stats span {
        line-height: 1em;
        font-size: .8rem;
        background-color: rgba(0, 0, 0, 0.2);
        color: #fff;
        padding: 10px;
        padding-left: 12.5px;
        padding-right: 12.5px;
        border-radius: 20px;
        display: inline-block;
        margin-right: 10px;
        margin-bottom: 10px;
        font-weight: 700; }
        .popup .inner .stats span i {
          margin-right: 5px; }

.stats-day {
  position: relative; }
  .stats-day .bar {
    overflow: visible;
    position: relative;
    background-color: rgba(42, 42, 42, 0.1);
    border-radius: 20px;
    z-index: 1;
    height: 20px; }
    @media all and (min-width: 800px) {
      .stats-day .bar {
        height: 10px; } }
    .stats-day .bar .cases {
      border-radius: 20px;
      position: absolute;
      bottom: 0px;
      left: 0px;
      width: 100%;
      height: 20px;
      background-color: rgba(42, 42, 42, 0.5); }
      @media all and (min-width: 800px) {
        .stats-day .bar .cases {
          height: 10px; } }
    .stats-day .bar .count, .stats-day .bar .date {
      position: absolute;
      top: 50%;
      transform: translate(-50%, -50%);
      width: 30px;
      text-align: center;
      color: #2a2a2a;
      font-size: .75em;
      line-height: 1em;
      font-weight: 700; }
      @media all and (min-width: 800px) {
        .stats-day .bar .count, .stats-day .bar .date {
          display: none; } }
    .stats-day .bar .count {
      right: -50px; }
    .stats-day .bar .date {
      left: -20px; }
    @media all and (min-width: 800px) {
      .stats-day .bar:hover {
        z-index: 2;
        background-color: #fff; }
        .stats-day .bar:hover .count {
          display: block; }
        .stats-day .bar:hover .date {
          display: block; }
        .stats-day .bar:hover .cases {
          background-color: #2a2a2a; } }

table {
  display: block;
  width: 100%; }
  table tr td {
    padding: 5px;
    font-size: .8em;
    line-height: 1em;
    font-weight: 700;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    width: 100%; }
  table tr:first-child td {
    border: none; }

.stats .label {
  text-align: center;
  font-size: .7em;
  line-height: 1em;
  padding: 5px; }
.stats.pie-wrap {
  max-width: 260px;
  margin-left: auto;
  margin-right: auto; }
.stats.graph-wrap {
  overflow-x: auto;
  max-width: 100%;
  background-color: rgba(0, 0, 0, 0.2);
  color: #fff;
  border-radius: 10px;
  box-shadow: inset 0px 0px 30px rgba(0, 0, 0, 0.4), 0px 0px 30px rgba(255, 255, 255, 0.05);
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */ }
  .stats.graph-wrap span {
    margin: 0px !important;
    padding: 0px !important; }
  .stats.graph-wrap h3 {
    padding: 20px;
    padding-top: 20px;
    padding-bottom: 0px; }
  .stats.graph-wrap p {
    padding: 20px;
    padding-top: 5px;
    padding-bottom: 0px; }
  .stats.graph-wrap .bar-inner {
    min-width: 1000px;
    padding: 20px;
    padding-bottom: 0px;
    margin-left: auto;
    margin-right: auto; }
  .stats.graph-wrap::-webkit-scrollbar {
    width: 10px;
    height: 10px; }
    @media all and (max-width: 800px) {
      .stats.graph-wrap::-webkit-scrollbar {
        width: 5px;
        height: 5px; } }
  .stats.graph-wrap::-webkit-scrollbar-track {
    background: #040404;
    border-radius: 0px 0px 10px 10px; }
  .stats.graph-wrap::-webkit-scrollbar-thumb {
    background: rgba(1, 198, 201, 0.9);
    border-radius: 0px 0px 10px 10px; }
  .stats.graph-wrap::-webkit-scrollbar-thumb:hover {
    background: #01f8fb; }

.cluster_detail_output {
  padding-top: 10px;
  padding-bottom: 10px; }
  .cluster_detail_output .item {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 10px;
    padding-bottom: 10px; }
    .cluster_detail_output .item:last-child {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
    .cluster_detail_output .item p {
      padding: 0px; }
      .cluster_detail_output .item p span {
        display: inline-block;
        line-height: 1em;
        font-weight: 700;
        background-color: rgba(0, 0, 0, 0.2);
        padding: 5px;
        padding-left: 10px;
        padding-right: 10px;
        min-width: 50px;
        text-align: center;
        border-radius: 20px;
        font-size: .75em;
        color: rgba(255, 255, 255, 0.75);
        margin-right: 5px;
        text-transform: uppercase; }
      .cluster_detail_output .item p.title {
        padding-bottom: 5px;
        font-weight: 700; }

.dhb_detail_output {
  padding-top: 10px;
  padding-bottom: 10px; }
  .dhb_detail_output .item {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 10px;
    padding-bottom: 10px; }
    .dhb_detail_output .item:last-child {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
    .dhb_detail_output .item span {
      float: right;
      display: inline-block;
      line-height: 1em;
      font-weight: 700;
      background-color: rgba(0, 0, 0, 0.2);
      padding: 5px;
      padding-left: 10px;
      padding-right: 10px;
      min-width: 50px;
      text-align: center;
      border-radius: 20px;
      font-size: .75em;
      color: rgba(255, 255, 255, 0.75);
      margin-right: 5px;
      text-transform: uppercase; }

@media all and (min-width: 800px) {
  .pie-outer-wrap {
    float: left;
    width: 33.33%;
    padding: 10px; }
    .pie-outer-wrap h3 {
      text-align: center;
      padding-left: 10px;
      padding-right: 10px; }
    .pie-outer-wrap.wide {
      float: none;
      width: auto; }
      .pie-outer-wrap.wide .stats.pie-wrap {
        max-width: 400px; } }

.donate {
  position: absolute;
  top: 0px;
  right: 0px;
  padding: 10px; }

* {
  /* width */
  /* Track */
  /* Handle */
  /* Handle on hover */ }
  *::-webkit-scrollbar {
    width: 10px;
    height: 10px; }
    @media all and (max-width: 800px) {
      *::-webkit-scrollbar {
        width: 5px;
        height: 5px; } }
  *::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px; }
  *::-webkit-scrollbar-thumb {
    background: rgba(1, 248, 251, 0.8);
    border-radius: 10px; }
  *::-webkit-scrollbar-thumb:hover {
    background: #01f8fb; }

.stats-grad {
  position: relative;
  margin-bottom: 10px;
  margin-top: 5px;
  margin-left: -10px; }
  @media all and (max-width: 800px) {
    .stats-grad {
      margin-left: -15px; }
      .stats-grad:after {
        content: '';
        position: absolute;
        display: block;
        top: 0px;
        right: 0px;
        height: 100%;
        width: 40px;
        pointer-events: none;
        background: linear-gradient(90deg, rgba(42, 42, 42, 0), #2a2a2a); } }

.stats-overview {
  overflow-y: auto;
  position: relative; }
  .stats-overview .stat-scroller {
    position: relative; }
    @media all and (max-width: 800px) {
      .stats-overview .stat-scroller {
        width: 1080px; } }
    @media all and (min-width: 800px) {
      .stats-overview .stat-scroller .stats-link {
        cursor: pointer; } }
  .stats-overview .stat-circle {
    width: 100px;
    height: 100px;
    display: inline-block;
    position: relative;
    border-radius: 100%;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 5px;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5), inset 0px 0px 15px rgba(255, 255, 255, 0.5);
    transition: .5s; }
    @media all and (min-width: 800px) {
      .stats-overview .stat-circle {
        width: 110px;
        height: 110px; } }
    @media all and (max-width: 800px) {
      .stats-overview .stat-circle:first-child {
        margin-left: 15px; } }
    .stats-overview .stat-circle .gain {
      position: absolute;
      top: -5px;
      right: -5px;
      width: 35px;
      height: 35px;
      border-radius: 100%;
      padding-top: 10px;
      padding-bottom: 10px;
      background-color: #2a2a2a;
      text-shadow: none;
      text-align: center;
      font-size: .75rem;
      line-height: 1em;
      font-weight: 700;
      transition: .5s .5s; }
    .stats-overview .stat-circle:nth-child(1) .gain {
      transition: .5s .4s; }
    .stats-overview .stat-circle:nth-child(2) .gain {
      transition: .5s .6s; }
    .stats-overview .stat-circle:nth-child(3) .gain {
      transition: .5s .8s; }
    .stats-overview .stat-circle:nth-child(4) .gain {
      transition: .5s 1s; }
    .stats-overview .stat-circle:nth-child(5) .gain {
      transition: .5s 1.2s; }
    .stats-overview .stat-circle:nth-child(6) .gain {
      transition: .5s 1.4s; }
    .stats-overview .stat-circle:nth-child(7) .gain {
      transition: .5s 1.6s; }
    .stats-overview .stat-circle.background-highlight {
      box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5), inset 0px 0px 15px #02ffff;
      text-shadow: 0px 0px 10px #02ffff; }
      .stats-overview .stat-circle.background-highlight .gain {
        border: 2px solid #01f8fb; }
    .stats-overview .stat-circle.background-alert {
      box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5), inset 0px 0px 15px #ff74c2;
      text-shadow: 0px 0px 10px #ff74c2; }
      .stats-overview .stat-circle.background-alert .gain {
        border: 2px solid #ff4d81; }
    .stats-overview .stat-circle.background-happy {
      box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5), inset 0px 0px 15px yellow;
      text-shadow: 0px 0px 10px yellow; }
      .stats-overview .stat-circle.background-happy .gain {
        border: 2px solid #ccf800; }
    .stats-overview .stat-circle.background-finished {
      box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5), inset 0px 0px 15px #ff78ff;
      text-shadow: 0px 0px 10px #ff78ff; }
      .stats-overview .stat-circle.background-finished .gain {
        border: 2px solid #ff50f9; }
    .stats-overview .stat-circle.background-sad .gain {
      border: 2px solid #fff; }
    .stats-overview .stat-circle.background-hospital {
      box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5), inset 0px 0px 15px #ff7171;
      text-shadow: 0px 0px 10px #ff7171; }
      .stats-overview .stat-circle.background-hospital .gain {
        border: 2px solid #ff4b4b; }
    .stats-overview .stat-circle.background-dark {
      background-color: rgba(0, 0, 0, 0.5);
      box-shadow: 0px 0px 20px rgba(0, 0, 0, 0);
      text-shadow: none; }
      .stats-overview .stat-circle.background-dark .c-inner span {
        font-size: 1rem; }
    @media all and (min-width: 800px) {
      .stats-overview .stat-circle:hover {
        transform: scale(1.05); } }
    .stats-overview .stat-circle .c-inner {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-size: .8rem;
      line-height: 1em;
      width: 100%;
      text-align: center;
      color: #2a2a2a;
      z-index: 2; }
      .stats-overview .stat-circle .c-inner i {
        font-size: 1.25rem;
        line-height: 1em;
        margin-bottom: 3px; }
      .stats-overview .stat-circle .c-inner span {
        display: block;
        font-size: 1.25rem;
        line-height: 1em;
        font-weight: 700;
        padding-top: 2.5px;
        padding-bottom: 2.5px; }

.horizontal-bar {
  padding-bottom: 17.5px; }
  .horizontal-bar .transmission-bar {
    height: 10px;
    float: left;
    position: relative; }
    .horizontal-bar .transmission-bar:after {
      content: '';
      display: block;
      height: 100%;
      background-color: rgba(1, 248, 251, 0.5);
      margin-right: 1px;
      margin-left: 1px; }
    .horizontal-bar .transmission-bar .transmission-bar-legend {
      position: absolute;
      font-size: .65rem;
      line-height: 1em;
      bottom: -17px;
      left: 0px;
      text-align: left;
      color: rgba(255, 255, 255, 0.75); }
    .horizontal-bar .transmission-bar h5 {
      font-weight: 700; }
    .horizontal-bar .transmission-bar:nth-child(1):after {
      background-color: rgba(1, 248, 251, 0.5); }
    .horizontal-bar .transmission-bar:nth-child(2):after {
      background-color: rgba(1, 248, 251, 0.3); }
    .horizontal-bar .transmission-bar:nth-child(3):after {
      background-color: rgba(1, 248, 251, 0.2); }
    .horizontal-bar .transmission-bar:last-child .transmission-bar-legend {
      left: auto;
      right: 0px;
      text-align: right;
      width: 150px; }
  .horizontal-bar:after {
    content: '';
    clear: both;
    display: block; }

body:not(.stats-loaded) .stat-circle {
  transform: scale(0); }
  body:not(.stats-loaded) .stat-circle .gain {
    transform: scale(0); }

.dhb-graphs {
  padding: 0px;
  padding-bottom: 10px;
  text-align: center; }
  .dhb-graphs .dhb-graph {
    display: inline-block;
    width: 50%;
    padding: 10px;
    font-size: .8rem; }
    .dhb-graphs .dhb-graph.full {
      display: block;
      width: 100%; }
    .dhb-graphs .dhb-graph canvas {
      margin-top: 10px; }
    .dhb-graphs .dhb-graph table {
      text-align: left; }
  .dhb-graphs:after {
    clear: both;
    display: block;
    content: '';
    position: relative; }

.popup .hosting-umbrellar {
  border-radius: 10px;
  margin-top: 15px;
  background-color: #fff;
  padding: 10px; }
  .popup .hosting-umbrellar img {
    display: block;
    width: 100%;
    padding: 10px;
    max-width: 350px; }
  .popup .hosting-umbrellar p {
    padding: 10px;
    font-weight: 700;
    color: #003f42; }
    .popup .hosting-umbrellar p a.block-link {
      background-color: #00dbff;
      color: #000; }
      .popup .hosting-umbrellar p a.block-link i {
        color: #000; }
      .popup .hosting-umbrellar p a.block-link:hover {
        background-color: #fff;
        color: #00dbff; }
        .popup .hosting-umbrellar p a.block-link:hover i {
          color: #00dbff; }

.congrats {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  z-index: 3; }
  .congrats .star {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 25%;
    transform: translate(0%, -50%);
    transform-origin: 0% 50%;
    color: #2a2a2a; }
    .congrats .star:nth-child(1) {
      transform: translate(0%, -50%) rotate(0deg) scale(2.5); }
      .congrats .star:nth-child(1) i {
        animation: stars 1.35s 0.6s forwards; }
    .congrats .star:nth-child(2) {
      transform: translate(0%, -50%) rotate(36deg) scale(2); }
      .congrats .star:nth-child(2) i {
        animation: stars 1.35s 0.6s forwards; }
    .congrats .star:nth-child(3) {
      transform: translate(0%, -50%) rotate(70deg) scale(1.75); }
      .congrats .star:nth-child(3) i {
        animation: stars 1.35s 0.7s forwards; }
    .congrats .star:nth-child(4) {
      transform: translate(0%, -50%) rotate(100deg) scale(3); }
      .congrats .star:nth-child(4) i {
        animation: stars 1.35s 0.65s forwards; }
    .congrats .star:nth-child(5) {
      transform: translate(0%, -50%) rotate(130deg) scale(1.5); }
      .congrats .star:nth-child(5) i {
        animation: stars 1.35s 0.5s forwards; }
    .congrats .star:nth-child(6) {
      transform: translate(0%, -50%) rotate(160deg) scale(2); }
      .congrats .star:nth-child(6) i {
        animation: stars 1.35s 0.5s forwards; }
    .congrats .star:nth-child(7) {
      transform: translate(0%, -50%) rotate(190deg) scale(2.3); }
      .congrats .star:nth-child(7) i {
        animation: stars 1.35s 0.65s forwards; }
    .congrats .star:nth-child(8) {
      transform: translate(0%, -50%) rotate(220deg) scale(2.8); }
      .congrats .star:nth-child(8) i {
        animation: stars 1.35s 0.72s forwards; }
    .congrats .star:nth-child(9) {
      transform: translate(0%, -50%) rotate(270deg) scale(1.5); }
      .congrats .star:nth-child(9) i {
        animation: stars 1.35s 0.55s forwards; }
    .congrats .star:nth-child(10) {
      transform: translate(0%, -50%) rotate(300deg) scale(3); }
      .congrats .star:nth-child(10) i {
        animation: stars 1.35s 0.7s forwards; }
    .congrats .star i {
      opacity: 0;
      position: absolute;
      top: 50%;
      left: 0px;
      font-size: .35rem;
      line-height: 1em; }

@keyframes stars {
  0% {
    left: 0%;
    opacity: 0;
    transform: translate(-50%, -50%) rotate(0deg); }
  30%,70% {
    opacity: .8; }
  100% {
    left: 100%;
    opacity: 0;
    transform: translate(-50%, -50%) rotate(360deg); } }

/*# sourceMappingURL=main.v59.css.map */