@media screen and (min-width: 768px) {
  @keyframes descIn {
    from {
      height: 100px;
    }
    to {
      height: 100%;
    }
  }
  @keyframes descOut {
    from {
      height: 100%;
    }
    to {
      height: 100px;
    }
  }
}
@media screen and (min-width: 768px) {
  @keyframes mdescIn {
    from {
      height: auto;
    }
    to {
      height: 100%;
    }
  }
  @keyframes mdescOut {
    from {
      height: 100%;
    }
    to {
      height: 100px;
    }
  }
}
@keyframes stoneshow {
  from {
    height: 36px;
  }
  to {
    height: 100%;
  }
}
@keyframes stonehide {
  from {
    height: 100%;
  }
  to {
    height: 36px;
  }
}
@keyframes ddshow {
  from {
    height: 54px;
    overflow: hidden;
  }
  to {
    height: 100%;
    overflow: visible;
  }
}
@keyframes ddhide {
  from {
    height: 100%;
    overflow: visible;
  }
  to {
    height: 54px;
    overflow: hidden;
  }
}
.prof .desc {
  animation-name: descOut;
  animation-duration: 0.2s;
  animation-fill-mode: forwards;
}

.prof:hover .desc {
  animation-name: descIn;
  animation-duration: 0.2s;
  animation-fill-mode: forwards;
}
.prof:hover .desc ._dd {
  display: flex !important;
}

.stone[active=true] .content {
  height: unset;
  animation-name: stoneshow;
  animation-duration: 0.1s;
  animation-fill-mode: forwards;
}

.stone[active=false] .content {
  height: unset;
  animation-name: stonehide;
  animation-duration: 0.1s;
  animation-fill-mode: forwards;
}

._dd[status=hide] {
  height: unset;
  animation-name: ddhide;
  animation-duration: 0.1s;
  animation-fill-mode: forwards;
}

._dd[status=show] {
  height: unset;
  animation-name: ddshow;
  animation-duration: 0.1s;
  animation-fill-mode: forwards;
}/*# sourceMappingURL=animation.css.map */