/* UTILS */
.-fs-sm {
  font-size: small !important;
}

.-fs-x-sm {
  font-size: x-small !important;
}

.-fs-xx-sm {
  font-size: xx-small !important;
}

.-pb-9 {
  padding-bottom: 9rem !important;
}

.-icon {
  width: 14px;
  height: 14px;
  margin: 2px;
}

/* MAIN */
.-bg {
  background: url(../img/bg.png),
    linear-gradient(#8e9eab, #8e9eab);
  background-color: #8e9eab;
}

.-header-label {
  height: 46px;
}

.-header-grey-bar {
  background-color: #334147;
  height: 31px;
  left: 0%;
  z-index: -1;
}

.-header {
  max-height: 31px;
}

.-border-radius {
  border-radius: .65rem .15rem;
}

.-bg-details-container {
  background: url("../img/bg.png"),
    linear-gradient(#6fb1fc, #4364f7, #0052d4);
}

.-footer {
  clip-path: polygon(0% 15%, 72.25% 15%, 85% 0%, 100% 0%, 100% 15%, 100% 100%, 5% 100%);
  margin-bottom: -1px;
  width: 380px;
  position: relative;
  left: calc(100% - 380px)
}

.-footer-blue-bar {
  background-color: #3b8aff;
  margin-top: 13px;
}

.-backToTop-button {
  display: none;
  position: fixed;
  bottom: 90px;
  right: 20px;
  cursor: pointer;
}

.-digimon-detail-img {
  max-width: 100%;
  max-height: 100%;
}

.-evolution-header {
  z-index: 100;
  position: relative;
  margin-bottom: -10px;
  margin-left: 10px;
}

.-evolutions-container {
  background-color: #c4c4dc;
}

.-details {
  border-radius: 40px 40px 0 0;
}

.-digimon-evolutions-img {
  max-width: calc(100% - 20px);
  max-height: calc(100% - 20px);
  margin: auto;
  cursor: pointer;
  display: inline-block;
  vertical-align: bottom;
}

.-digimon-img {
  vertical-align: bottom;
  cursor: pointer;
  margin: 1px;
}