.animated-bg:before{content:"";position:absolute;bottom:0;left:0;right:0;height:0;background:var(--color-primary);animation:fillUpTransform 3s ease-in-out forwards;z-index:-2}.animated-black-to-white{color:white;animation:textColorChange .3s ease-in-out forwards}.fadeout{opacity:1;animation:fadeOutAnimation .3s ease-in-out forwards}.fadein{opacity:1;animation:fadeInAnimation .3s ease-in-out forwards}.fadeinUpscale{opacity:0;animation:fadeInScaleAnimation .3s ease-in-out forwards}.fadeoutDownscale{opacity:1;animation:fadeOutDownscaleAnimation .3s ease-in-out forwards}@keyframes fillUpTransform{0%{height:0}to{height:100%}}@keyframes textColorChange{0%{color:var(--color-secondary3)}to{color:var(--color-white)}}@keyframes fadeOutAnimation{0%{opacity:1}to{opacity:0}}@keyframes fadeInAnimation{0%{opacity:0}to{opacity:1}}@keyframes fadeInScaleAnimation{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes fadeOutDownscaleAnimation{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.5)}}