.face-container{justify-content:center;align-items:center;margin:2rem 0;display:flex}.face{color:#374151;width:12em;height:auto;transition:color .3s;display:block}.dark .face{color:#e5e7eb}.face__eyes,.face__eye-lid,.face__mouth-left,.face__mouth-right,.face__nose,.face__pupil{animation:1s cubic-bezier(.65,0,.35,1) .3s forwards eyes}.face__eye-lid,.face__pupil{animation-duration:4s;animation-iteration-count:infinite;animation-delay:1.3s}.face__eye-lid{animation-name:eye-lid}.face__mouth-left,.face__mouth-right{animation-timing-function:cubic-bezier(.33,1,.68,1)}.face__mouth-left{animation-name:mouth-left}.face__mouth-right{animation-name:mouth-right}.face__nose{animation-name:nose}.face__pupil{animation-name:pupil}@keyframes eye-lid{0%,40%,45%,to{transform:translateY(0)}42.5%{transform:translateY(17.5px)}}@keyframes eyes{0%{transform:translateY(112.5px)}to{transform:translateY(15px)}}@keyframes pupil{0%,37.5%,40%,45%,87.5%,to{stroke-dashoffset:0;transform:translate(0)}12.5%,25%,62.5%,75%{stroke-dashoffset:0;transform:translate(-35px)}42.5%{stroke-dashoffset:35px;transform:translateY(17.5px)}}@keyframes mouth-left{0%,50%{stroke-dashoffset:-102px}to{stroke-dashoffset:0}}@keyframes mouth-right{0%,50%{stroke-dashoffset:102px}to{stroke-dashoffset:0}}@keyframes nose{0%{transform:translate(0)}to{transform:translateY(22.5px)}}@media (max-width:640px){.face{width:10em}}