.hasjs [data-animate] {
  opacity: 0
}
#storybook-root [data-animate] {
  opacity: 0
}
.hasjs .animate {
  opacity: 1
}
#storybook-root .animate {
  opacity: 1
}
.animate--fade-in {
  -webkit-animation: fade-in 1s ease-in both;
  animation: fade-in 1s ease-in both
}
.animate--fade-in-left {
  -webkit-animation: fade-in-left .6s ease-in both;
  animation: fade-in-left .6s ease-in both
}
.animate--fade-in-top {
  -webkit-animation: fade-in-top .6s ease-in both;
  animation: fade-in-top .6s ease-in both
}
.animate--fade-in-left {
  -webkit-animation: fade-in-left .6s ease-in both;
  animation: fade-in-left .6s ease-in both
}
.animate[data-animation-duration="0"] {
  -webkit-animation-duration: 0s;
  animation-duration: 0s
}
.animate[data-animation-delay="0"] {
  -webkit-animation-delay: 0s;
  animation-delay: 0s
}
.animate[data-animation-duration="50"] {
  -webkit-animation-duration: 50ms;
  animation-duration: 50ms
}
.animate[data-animation-delay="50"] {
  -webkit-animation-delay: 50ms;
  animation-delay: 50ms
}
.animate[data-animation-duration="100"] {
  -webkit-animation-duration: .1s;
  animation-duration: .1s
}
.animate[data-animation-delay="100"] {
  -webkit-animation-delay: .1s;
  animation-delay: .1s
}
.animate[data-animation-duration="150"] {
  -webkit-animation-duration: 150ms;
  animation-duration: 150ms
}
.animate[data-animation-delay="150"] {
  -webkit-animation-delay: 150ms;
  animation-delay: 150ms
}
.animate[data-animation-duration="200"] {
  -webkit-animation-duration: .2s;
  animation-duration: .2s
}
.animate[data-animation-delay="200"] {
  -webkit-animation-delay: .2s;
  animation-delay: .2s
}
.animate[data-animation-duration="250"] {
  -webkit-animation-duration: 250ms;
  animation-duration: 250ms
}
.animate[data-animation-delay="250"] {
  -webkit-animation-delay: 250ms;
  animation-delay: 250ms
}
.animate[data-animation-duration="300"] {
  -webkit-animation-duration: .3s;
  animation-duration: .3s
}
.animate[data-animation-delay="300"] {
  -webkit-animation-delay: .3s;
  animation-delay: .3s
}
.animate[data-animation-duration="350"] {
  -webkit-animation-duration: 350ms;
  animation-duration: 350ms
}
.animate[data-animation-delay="350"] {
  -webkit-animation-delay: 350ms;
  animation-delay: 350ms
}
.animate[data-animation-duration="400"] {
  -webkit-animation-duration: .4s;
  animation-duration: .4s
}
.animate[data-animation-delay="400"] {
  -webkit-animation-delay: .4s;
  animation-delay: .4s
}
.animate[data-animation-duration="450"] {
  -webkit-animation-duration: 450ms;
  animation-duration: 450ms
}
.animate[data-animation-delay="450"] {
  -webkit-animation-delay: 450ms;
  animation-delay: 450ms
}
.animate[data-animation-duration="500"] {
  -webkit-animation-duration: .5s;
  animation-duration: .5s
}
.animate[data-animation-delay="500"] {
  -webkit-animation-delay: .5s;
  animation-delay: .5s
}
.animate[data-animation-duration="550"] {
  -webkit-animation-duration: 550ms;
  animation-duration: 550ms
}
.animate[data-animation-delay="550"] {
  -webkit-animation-delay: 550ms;
  animation-delay: 550ms
}
.animate[data-animation-duration="600"] {
  -webkit-animation-duration: .6s;
  animation-duration: .6s
}
.animate[data-animation-delay="600"] {
  -webkit-animation-delay: .6s;
  animation-delay: .6s
}
.animate[data-animation-duration="650"] {
  -webkit-animation-duration: 650ms;
  animation-duration: 650ms
}
.animate[data-animation-delay="650"] {
  -webkit-animation-delay: 650ms;
  animation-delay: 650ms
}
.animate[data-animation-duration="700"] {
  -webkit-animation-duration: .7s;
  animation-duration: .7s
}
.animate[data-animation-delay="700"] {
  -webkit-animation-delay: .7s;
  animation-delay: .7s
}
.animate[data-animation-duration="750"] {
  -webkit-animation-duration: 750ms;
  animation-duration: 750ms
}
.animate[data-animation-delay="750"] {
  -webkit-animation-delay: 750ms;
  animation-delay: 750ms
}
.animate[data-animation-duration="800"] {
  -webkit-animation-duration: .8s;
  animation-duration: .8s
}
.animate[data-animation-delay="800"] {
  -webkit-animation-delay: .8s;
  animation-delay: .8s
}
.animate[data-animation-duration="850"] {
  -webkit-animation-duration: 850ms;
  animation-duration: 850ms
}
.animate[data-animation-delay="850"] {
  -webkit-animation-delay: 850ms;
  animation-delay: 850ms
}
.animate[data-animation-duration="900"] {
  -webkit-animation-duration: .9s;
  animation-duration: .9s
}
.animate[data-animation-delay="900"] {
  -webkit-animation-delay: .9s;
  animation-delay: .9s
}
.animate[data-animation-duration="950"] {
  -webkit-animation-duration: 950ms;
  animation-duration: 950ms
}
.animate[data-animation-delay="950"] {
  -webkit-animation-delay: 950ms;
  animation-delay: 950ms
}
.animate[data-animation-duration="1000"] {
  -webkit-animation-duration: 1s;
  animation-duration: 1s
}
.animate[data-animation-delay="1000"] {
  -webkit-animation-delay: 1s;
  animation-delay: 1s
}
.animate[data-animation-duration="1050"] {
  -webkit-animation-duration: 1.05s;
  animation-duration: 1.05s
}
.animate[data-animation-delay="1050"] {
  -webkit-animation-delay: 1.05s;
  animation-delay: 1.05s
}
.animate[data-animation-duration="1100"] {
  -webkit-animation-duration: 1.1s;
  animation-duration: 1.1s
}
.animate[data-animation-delay="1100"] {
  -webkit-animation-delay: 1.1s;
  animation-delay: 1.1s
}
.animate[data-animation-duration="1150"] {
  -webkit-animation-duration: 1.15s;
  animation-duration: 1.15s
}
.animate[data-animation-delay="1150"] {
  -webkit-animation-delay: 1.15s;
  animation-delay: 1.15s
}
.animate[data-animation-duration="1200"] {
  -webkit-animation-duration: 1.2s;
  animation-duration: 1.2s
}
.animate[data-animation-delay="1200"] {
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s
}
.animate[data-animation-duration="1250"] {
  -webkit-animation-duration: 1.25s;
  animation-duration: 1.25s
}
.animate[data-animation-delay="1250"] {
  -webkit-animation-delay: 1.25s;
  animation-delay: 1.25s
}
.animate[data-animation-duration="1300"] {
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s
}
.animate[data-animation-delay="1300"] {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s
}
.animate[data-animation-duration="1350"] {
  -webkit-animation-duration: 1.35s;
  animation-duration: 1.35s
}
.animate[data-animation-delay="1350"] {
  -webkit-animation-delay: 1.35s;
  animation-delay: 1.35s
}
.animate[data-animation-duration="1400"] {
  -webkit-animation-duration: 1.4s;
  animation-duration: 1.4s
}
.animate[data-animation-delay="1400"] {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s
}
.animate[data-animation-duration="1450"] {
  -webkit-animation-duration: 1.45s;
  animation-duration: 1.45s
}
.animate[data-animation-delay="1450"] {
  -webkit-animation-delay: 1.45s;
  animation-delay: 1.45s
}
.animate[data-animation-duration="1500"] {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s
}
.animate[data-animation-delay="1500"] {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s
}
.animate[data-animation-duration="1550"] {
  -webkit-animation-duration: 1.55s;
  animation-duration: 1.55s
}
.animate[data-animation-delay="1550"] {
  -webkit-animation-delay: 1.55s;
  animation-delay: 1.55s
}
.animate[data-animation-duration="1600"] {
  -webkit-animation-duration: 1.6s;
  animation-duration: 1.6s
}
.animate[data-animation-delay="1600"] {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s
}
.animate[data-animation-duration="1650"] {
  -webkit-animation-duration: 1.65s;
  animation-duration: 1.65s
}
.animate[data-animation-delay="1650"] {
  -webkit-animation-delay: 1.65s;
  animation-delay: 1.65s
}
.animate[data-animation-duration="1700"] {
  -webkit-animation-duration: 1.7s;
  animation-duration: 1.7s
}
.animate[data-animation-delay="1700"] {
  -webkit-animation-delay: 1.7s;
  animation-delay: 1.7s
}
.animate[data-animation-duration="1750"] {
  -webkit-animation-duration: 1.75s;
  animation-duration: 1.75s
}
.animate[data-animation-delay="1750"] {
  -webkit-animation-delay: 1.75s;
  animation-delay: 1.75s
}
.animate[data-animation-duration="1800"] {
  -webkit-animation-duration: 1.8s;
  animation-duration: 1.8s
}
.animate[data-animation-delay="1800"] {
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s
}
.animate[data-animation-duration="1850"] {
  -webkit-animation-duration: 1.85s;
  animation-duration: 1.85s
}
.animate[data-animation-delay="1850"] {
  -webkit-animation-delay: 1.85s;
  animation-delay: 1.85s
}
.animate[data-animation-duration="1900"] {
  -webkit-animation-duration: 1.9s;
  animation-duration: 1.9s
}
.animate[data-animation-delay="1900"] {
  -webkit-animation-delay: 1.9s;
  animation-delay: 1.9s
}
.animate[data-animation-duration="1950"] {
  -webkit-animation-duration: 1.95s;
  animation-duration: 1.95s
}
.animate[data-animation-delay="1950"] {
  -webkit-animation-delay: 1.95s;
  animation-delay: 1.95s
}
.animate[data-animation-duration="2000"] {
  -webkit-animation-duration: 2s;
  animation-duration: 2s
}
.animate[data-animation-delay="2000"] {
  -webkit-animation-delay: 2s;
  animation-delay: 2s
}
@-webkit-keyframes fade-in {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}
@keyframes fade-in {
  0% {
    opacity: 0
  }
  100% {
    opacity: 1
  }
}
@-webkit-keyframes fade-in-top {
  from {
    opacity: 0;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem)
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}
@keyframes fade-in-top {
  from {
    opacity: 0;
    -webkit-transform: translateY(3rem);
    transform: translateY(3rem)
  }
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0)
  }
}
@-webkit-keyframes fade-in-left {
  from {
    opacity: 0;
    -webkit-transform: translateX(-3rem);
    transform: translateX(-3rem)
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}
@keyframes fade-in-left {
  from {
    opacity: 0;
    -webkit-transform: translateX(-3rem);
    transform: translateX(-3rem)
  }
  to {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0)
  }
}