body {
  font-family: 'Cascadia Code', monospace;
  color: rgb(188, 185, 184);
  background-color: rgb(30, 30, 30);
}

a {
  text-decoration: none;
}

table {
  text-align: left!important;
  margin-top: 0;
  color: rgb(188, 185, 184)!important;
}

th, td {
  padding-top: 0!important;
  padding-bottom: 0!important;
}

.max-width-1200px {
  max-width: 1200px
}

.max-width-600px {
  max-width: 600px
}

.handwritten-font {
  font-family: 'Permanent Marker';
}

.color-white {
  color: rgb(188, 185, 184);
}

.color-btc {
  color: rgb(213, 142,66);
}

.color-eth {
  color: rgb(51, 94, 170);
}

.color-winner {
  color: rgb(90, 179, 126);
}

.color-loser {
  color: rgb(188, 185, 184);
  background-color: rgb(165, 57, 53)!important;
}

@keyframes rainbowColors {
  from, to { fill: white; }
  25%      { fill: rgb(250, 233, 106); }
  35%      { fill: rgb(188, 223, 135); }
  45%      { fill: rgb(124, 208, 222); }
  55%      { fill: rgb(108, 157, 231); }
  65%      { fill: rgb(208, 153, 206); }
  75%      { fill: rgb(239, 161, 149); }
}

@keyframes orangeAndWhite {
  from, to { fill: white; }
  45%, 55% { fill: orange; }
}

svg {
  fill: rgb(188, 185, 184);;
}

svg:hover {
  fill: #54e1c5;
}

svg.rotate-color-rainbow {
  animation: rainbowColors 5s infinite;
}

svg.rotate-color-orange {
  animation: orangeAndWhite 5s infinite;
}

#spinnerContainer {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: fixed;
  display: block;
  opacity: 0.7;
  background-color: #f5f5f5;
  z-index: 99;
  text-align: center;
}

#spinner {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 100;
}

#spinnerText {
  color: #b75b63;
}

@keyframes blink {
  from, to { color: transparent; }
  50% { color: rgb(188, 185, 184); }
}

@-moz-keyframes blink {
  from, to { color: transparent; }
  50% { color: rgb(188, 185, 184); }
}

@-webkit-keyframes blink {
  from, to { color: transparent; }
  50% { color: rgb(188, 185, 184); }
}

@-ms-keyframes blink {
  from, to { color: transparent; }
  50% { color: rgb(188, 185, 184); }
}

@-o-keyframes blink {
  from, to { color: transparent; }
  50% { color: rgb(188, 185, 184); }
}

#blinkingCursor {
  -webkit-animation: 1s blink step-end infinite;
  -moz-animation: 1s blink step-end infinite;
  -ms-animation: 1s blink step-end infinite;
  -o-animation: 1s blink step-end infinite;
  animation: 1s blink step-end infinite;
}
