﻿@keyframes form-field--grow-in {
    0% {
        margin-top: 0px;
        height: 0%;
        opacity: 0;
    }

    100% {
        margin-top: 32px;
        height: 48px; /* This only works if the field does not have errors */
        opacity: 1;
    }
}
.app__form-field--animate-in {
    animation-name: form-field--grow-in;
    animation-duration: 0.4s;
    animation-fill-mode: forwards;
}

@keyframes form-field-action--grow-in {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
.app__form-field-action--animate-in {
    animation-name: form-field-action--grow-in;
    animation-duration: 0.4s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
}
