/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
.avc-dashboard {
  position: relative;
}

.avc-account-wrapper::before {
  position: absolute;
  width: 12rem;
  aspect-ratio: 1;
  content: "";
  background-image: url("../img/atlas_purple.png");
  background-size: contain;
  background-attachment: initial;
  background-position: center center;
  background-repeat: no-repeat;
  left: -11rem;
  top: -0.5rem;
  -webkit-animation: vibrate-3 9s linear infinite both;
  animation: vibrate-3 9s linear infinite both;
}

.avc-account-wrapper::after {
  position: absolute;
  width: 12rem;
  aspect-ratio: 1;
  content: "";
  background-image: url("../img/ethereion_green_flipped.png");
  background-size: contain;
  background-attachment: initial;
  background-position: center center;
  background-repeat: no-repeat;
  right: -10rem;
  top: 30%;
  -webkit-animation: vibrate-3 11s linear infinite both;
  animation: vibrate-3 11s linear infinite both;
}

.avc-task-wrapper::before {
  position: absolute;
  width: 12rem;
  aspect-ratio: 1;
  content: "";
  background-image: url("../img/anireion_red.png");
  background-size: contain;
  background-attachment: initial;
  background-position: center center;
  background-repeat: no-repeat;
  left: -10rem;
  top: 60%;
  -webkit-animation: vibrate-3 10s linear infinite both reverse;
  animation: vibrate-3 10s linear infinite both reverse;
}

.avc-task-item-next-time {
  color: #fff;
  font-size: 0.8rem;
}
.avc-task-item-warning {
  color: #fa5f45;
  font-size: 0.8rem;
}

.twitter-share-button {
  visibility: hidden;
}

.twitter-share-button.twitter-share-button-rendered {
  visibility: visible;
}

@-webkit-keyframes vibrate-3 {
  0% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  10% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  20% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  30% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(2px, 2px);
    transform: translate(2px, 2px);
  }
  50% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  70% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  80% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  90% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes vibrate-3 {
  0% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  10% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  20% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  30% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(2px, 2px);
    transform: translate(2px, 2px);
  }
  50% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  70% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  80% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  90% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
