@import url('https://fonts.googleapis.com/css?family=Press+Start+2P');

/** Полоса доната */
.dg-bar {
  border-radius: 1rem;
  background: rgba(0, 0, 0, 0) !important;
  border: none !important;
  overflow: visible !important;
  box-shadow: none !important;
}

/** Контейнер */
.dg-bar-container {
  padding: 10px 0 !important;
}

/** Финиш */

.dg-bar:after {
  content: '';
  background: url('http://i51.mindmix.ru/46/69/356946/64/8349064/tumblr_n6edbarXGk1snc5kxo1_500.gif') 100% 100% no-repeat;
  background-size: cover;
  width: 3rem;
  height: 3rem;
  position: absolute;
  z-index: -1;
  top: -0rem;
  right: 0.7rem;
  animation: goal 30s infinite linear;
}

/** Анимации */
@keyframes rainbow {
  0% {
    background-position-x: 11.5rem;
  }
  100% {
    background-position-x: 0rem;
  }
}

@keyframes player {
  0% {
    background-position-y: -0.5rem;
  }
  50% {
    background-position-y: -0.1rem;
  }
  100% {
    background-position-y: -0.5rem;
  }
}

@keyframes goal {
  0%, 2%, 4%, 100% {
    margin-top: -0.1rem;
  }
  1%, 3% {
    margin-top: 0.1rem;
  }
}

/** Полоса прогресса */
.dg-bar-line {
  background: none !important;
  border: none !important;
  overflow: visible !important;
  margin-top: -0.5rem;
  height: calc(100% + 1rem) !important;
}

.dg-bar-line:before {
  content: '';
  background: url('http://klybok.net/streamer/cat.png');
  background-repeat: repeat-x;
  background-size: 11.5rem 2.9rem !important;

  position: absolute;
  left: 0;
  right: 0;
  top: 0.2rem;
  bottom: 0;

  animation: rainbow 3s infinite linear;
}

/** Персонаж */
.dg-bar-line:after {
  content: '';
  background: url('http://www.pngall.com/wp-content/uploads/2016/06/Nyan-Cat-Transparent.png') 100% 100% no-repeat;
  background-size: cover;
  width: 6.4rem;
  height: 4.2rem;
  position: absolute;
  z-index: 3;
  top: -0.4rem;
  right: -2.5rem;
  animation: player 1.3s infinite linear;
}

.plain-text {
  color: #fb8527 !important;
}

.dg-bar-text {
  color: #fff !important;
  text-shadow: 2px 2px 0 black !important;
  position: absolute;
  z-index: 5;
  margin-bottom: -6rem;
}

.dg-title {
  margin-bottom: 0.3rem;
}

/** Шрифт */

* {
  font-family: 'Press Start 2P', cursive !important;
}

.dg-title {
  font-size: 1.1rem !important;
  font-weight: 100 !important;
  word-spacing: -0.6rem !important;
}

.dg-bar-text {
  font-size: 1rem !important;
  word-spacing: -0.6rem !important;
  text-align: left !important;
  padding-left: 10px;
}

.right.plain-text{
  margin-top: 0.4rem;
  font-size: 0.9rem !important;
  word-spacing: -0.6rem !important;
}

.left.plain-text {
  display: none !important;;
}